<style scoped>

.extendGroup {
  float: right;
  margin-right: 20px;
  opacity: 0;
}

.el-tree-node__content:hover .extendGroup {
  opacity: 1;
}
.list_title{padding-bottom: 30px;}
.range{
    white-space: nowrap;
}
.range .el-input{display: inline-block;width:50%;}
.toolbar_header {
    white-space: normal;
}
</style>

<template>
  <div>

      <template v-if="routerPath=='capitalflow'" >
        <div v-loading="loading">
          <!--工具条-->
          <el-col :span="24" class="toolbar toolbar_header" style="padding-bottom: 0px;">
            <el-form :inline="true" :model="filters">
              <el-form-item label="币种:">
                <el-select v-model="filters.region" placeholder="请选择">
                  <el-option label="全部" value="1"></el-option>
                  <el-option label="BTC" value="2"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="用户名:">
                <el-input v-model="filters.name" placeholder="等值匹配"></el-input>
              </el-form-item>
              <el-form-item label="手机号:">
                <el-input v-model="filters.phoneNum" placeholder="可模糊匹配"></el-input>
              </el-form-item>
              <el-form-item label="备注:">
                <el-select v-model="filters.remarks" placeholder="请选择">
                  <el-option label="全部" value="1"></el-option>
                  <el-option label="充值" value="2"></el-option>
                  <el-option label="冻结" value="3"></el-option>
                  <el-option label="解冻" value="4"></el-option>
                  <el-option label="转入" value="5"></el-option>
                  <el-option label="转出" value="6"></el-option>
                  <el-option label="注册奖励" value="7"></el-option>
                  <el-option label="邀请注册奖励" value="8"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="金额范围:" class="range">
                <el-input v-model="filters.rangeStart" placeholder="起始范围(整数)"></el-input>
                <el-input v-model="filters.rangeEnd" placeholder="结束范围(整数)"></el-input>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" v-on:click="fetchData">搜索</el-button>
              </el-form-item>
            </el-form>
          </el-col>        
        <!-- table start  -->
        <el-table :data="list" style="width: 100%" max-height="1000">
          <el-table-column width="37">
            <template scope="scope">
              <img src="../assets/img/sysFile.gif">
            </template>
          </el-table-column> 
          <el-table-column label="ID"     type="index"    width="60">
          </el-table-column>      
          <el-table-column prop="loginName" label="用户名" >
          </el-table-column>
              
          <el-table-column prop="certNo" label="手机号">
          </el-table-column>
          <el-table-column prop="userMail" label="币种名称">
          </el-table-column>
          <el-table-column prop="userMail" label="数额" >
          </el-table-column>
          <el-table-column prop="userMail" label="备注" >
          </el-table-column>
                 
          <el-table-column prop="userMail" label="日期">
          </el-table-column>
       
        </el-table>
          <!--工具条-->
        <el-col :span="24" class="toolbar toolbar_footer">
          <el-pagination v-if="total" background layout="prev, pager, next,total,jumper" @current-change="handleCurrentChange" :page-size="showCount" :total="total" style="float:right;">
          </el-pagination>
        </el-col>
        <!-- table end  -->

      </div>
      </template>
       <template v-else>
        <router-view></router-view>
      </template>
  </div>

  
  
</template>

<script>
import * as users from '../api/users';

let myMixin = {
  data: function() {
    return { users }
  }
}

export default {
  mixins: [myMixin],
  data() {
    return {
      filters:{},
      isDel:true,
      isEdit:true,
      isReleRole:true,
      isReleGroup:true,
      total: 10,
      page: 1,
      showCount:10,
      routerPath:'',
      addLoading:false,//
      editLoading:false,//
      list: [
        { userName:"test",
          userGender:1,
          loginName:"test",
          loginPass:"test",
          phoneNum:"test",
          userMail:"test",
          certNo:"test",
        },
        { userName:"test",
          userGender:1,
          loginName:"test",
          loginPass:"test",
          phoneNum:"test",
          userMail:"test",
          certNo:"test",
        }
      ],
      canReset: true,
      loading: false,
      groupId:'',//组id
      userId:''//用户id
    }
  },
  methods: {
 
    handleCurrentChange(val) {
      this.page = val;
      // this.getUsers();
      this.fetchData();
    },

    fetchData(init) {
      this.loading = true;
      if(!this.$_has([users.request])){
        this.$message("暂无权限");
        this.loading = false;

        return;
      }
      let para = {
          // groupId:this.groupId,
          showCount:this.showCount,
          currentPage:this.page,//当前查询页
          keyword:this.filters.name,
          region:this.filters.region,
          phoneNum:this.filters.phoneNum
        };
        if(this.groupId!=undefined&&this.groupId!="undefined"&&this.groupId!=""){
          this.$set(para,'groupId',this.groupId)
        }
      users.request.r(para).then((res) => {
        this.total=res.data.data.totalRow;
        this.list = res.data.data.list;
        
        if(this.list!=null){
          this.list.map(x=>{
            this.$set(x,'showIndex',2)  
            this.$set(x,'showClose',false)       
            this.$set(x,'showCloseG',false)       
            this.$set(x,'showIndexG',2)         
          })
        }

        this.loading = false;
      });
    },
    requestNotAllowed: function(){
      users.notAllowed.r();
    }
  },
  watch: {
          // 如果路由有变化，会再次执行该方法
          "$route": function(){
            this.routerPath=this.$route.path.split("/").pop();
            this.groupId="";
            this.fetchData(true)

          }
  },
  created() {
   /* this.isReleRole=this.$_has([users.releRolesUser]);
    this.isReleGroup=this.$_has([users.releGroupUser]);
    this.isEdit=this.$_has([users.modify]);
    this.isDel=this.$_has([users.remove]);
    if(this.$route.query.groupId!=undefined&&this.$route.query.groupId!="undefined"&&this.$route.query.groupId!=""){
      this.groupId=this.$route.query.groupId;
    }

    this.fetchData(true)*/
    /*console.log(this.$route.path.split("/").pop())*/
    this.routerPath=this.$route.path.split("/").pop();
    

  }
}
</script>